<!-- 已付款 -->
<template>
  <div class="page-box h100 display-flex czbj">
    <p class="title-label mb10">已付款</p>
    <dxtable
      :dataJson="dataJson"
      :portUrl="portUrl"
      :formJson="formJson"
      :hidebj="true"
      :qx="qx"
      ref="databale"
    ></dxtable>

    <n-modal v-model:show="showModal" preset="card" class="dfdsrtyrytyt">
      <template #header>
        <div>发货</div>
      </template>
      <div>
        <div class="display-flex">
          <div class="flex-1">收件人：{{ jsdfds.name }}</div>
         <div> 联系电话:{{ jsdfds.phone }}</div>
        </div>
        <div>
          详细地址:{{ jsdfds.province }}{{ jsdfds.city }}{{ jsdfds.district }}{{ jsdfds.detail }}
        </div>
        <div class="mt20">
          <n-select
            v-model:value="ShipperCode"
            placeholder="请选择快递公司"
            :options="kjxzdd"
            filterable
          />
        </div>
        <div class="mt20">
          <n-input v-model:value="LogisticCode" placeholder="物流编号" />
        </div>
      </div>
      <template #action>
        <div class="tr">
          <n-button type="primary" @click="shenhedtyt" :loading="hjshsd">
            确认发货
          </n-button>
          <n-button class="ml20" @click="showModal = false"> 关闭 </n-button>
        </div>
      </template>
    </n-modal>
  </div>
</template>
<script lang="ts" setup>
import dxtable from "../../../components/util/dxtable.vue";
import sort from "../../../components/util/sort.vue";
import { dxget, dxpost,transferTimeYMDHm } from "../../../util/index";
import { NButton, NImage, NTag } from "naive-ui";
import { h, ref, reactive } from "vue";
const databale = ref();
const showModal = ref(false);
const rowData = ref({});
const shhehsdrt = ref();
const hjshsd = ref();
const kjxzdd = ref([]);
const ShipperCode = ref(null);
const LogisticCode = ref();
const jsdfds = ref({})
const initeer = () => {
  databale.value.initDataExpose();
};
let zhidfds = [
      {
        label:"微信",
        value:"1"
      },{
        label:"支付宝",
        value:"2"
      },{
        label:"平台币",
        value:"3"
      }
    ]
let fdsd = ref()
const shjjseft = ref("1");
let dataJson = [
  {
    title: "订单编号",
    key: "ddON",
    width: "180",
  },
  {
    title: "商品名称",
      key: "c.title",
      "search": true,
      width:200,
      render(row){
        return row.jstitle
      }
  },
  {
    title: "单价",
    key: "jsdanjia",
  },
  {
    title: "数量",
    key: "number",
  },{
      title: "支付金额",
      key: "jiner",
    },
  {
    title: "支付方式",
    key: "zhifuqd",
    type: "select",
    options: [
      {
        label: "全部",
        value: "",
      },
      ...zhidfds,
    ],
    search: true,
    width: 80,
    render(row) {
      let ksdfsd = "--"
      if(row.zhifuqd==1){
        ksdfsd="微信"
      }
      if(row.zhifuqd==2){
         ksdfsd="支付宝"
      }
      if(row.zhifuqd==3){
        ksdfsd="平台币"
      }
      return ksdfsd
    }
  },
  {
    title: "购买人姓名",
    width: 80,
    key: "b.name",
    search: true,
    render(row) {
      return row.uname;
    },
  },
  {
    title: "电话",
    key: "uphone",
  },
  
  {
    title: "下单时间",
    key: "addTime",
    width: 150,
  },
  {
    title: "操作",
    width: 150,
    render(row) {
      return h(
        NButton,
        {
          dxdata: row,
          quaternary: true,
          type: "info",
          loading:fdsd.value,
          onClick: async function () {
            shhehsdrt.value = "";
            ShipperCode.value = "";
            LogisticCode.value = "";
            rowData.value = row;
            fdsd.value = true
            const {data}:any = await dxget("jyc/dizhi/dizhi",{id:row.dzid})
            fdsd.value = false
            jsdfds.value = data

            showModal.value = true;
          },
        },
        "发货"
      );
    },
  },
];

const qx = {
  DeletePermissionID: "234567", //删除
  EditPermissionIdentifier: "234567", // 编辑
  NewPermissionIdentifier: "234567", // 新建
  ViewPermissionID: "234567", // 查看
};
const portUrl = "jyc/dingdanzhuangtai/dingdanzhuangtai?type=2&state=2";

let formJson = reactive([]);
// 获取字典内容
const xtgxxmfl = async () => {
  const { data }: any = await dxget("dxgjAdmin/getzd", { name: "jyckdgsbm" });
  kjxzdd.value = data;
};
xtgxxmfl();
const shenhedtyt = async () => {
  if (!ShipperCode.value) {
    window.$message.error("请选择快递公司");
    return;
  }
  if (!LogisticCode.value) {
    window.$message.error("请输入物流编码");
    return;
  }
  hjshsd.value = true
  const data = await dxpost("jyc/dingdanzhuangtai/dingdanzhuangtai",{
    id:rowData.value.id,
    ktgs:ShipperCode.value,
    ktbh:LogisticCode.value,
    fhsj:transferTimeYMDHm(),
    state:3
  },"put")
  hjshsd.value = false
  showModal.value = false;
  initeer()
};
</script>
<style scoped></style>
<style>
.dfdsrtyrytyt {
  width: 400px;
}
</style>
